<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/xinxi.css">
    <script src="js/jquery-3.2.1.js"></script>
</head>
<body>
    <div class="back">
        <img  src="images/timg (6).gif" alt="">
        <div class="zh1">
            <a href="file:///H:/%E5%A4%A7%E4%BD%9C%E4%B8%9A/%E4%B8%BB%E9%A1%B5.html"><img src="images/shangyige (1).png" alt=""></a>
        </div>
        <div class="zh2">
            <a href="https://wang-xue0.gitee.io/work3"><img src="images/xiayige (1).png" alt=""></a>
        </div>
        <div class="kuangjia">
            <div class="tx">
                <span class="tx1"><img src="images/xinxi/timg (3).jpg" alt=""></span>
                <div class="lyg">
                    <span class="tx2"><img src="images/xinxi/tx.jpg" alt=""></span>
                </div>
            </div>
            <div class="xinxi">
                <button id="grxx">个人信息</button>
                <table id="kuang">
                    <tr>
                        <td class="k">姓名:</td>
                        <td>王薛</td>
                    </tr>
                    <tr>
                        <td class="k">年龄:</td>
                        <td>20</td>
                    </tr>
                    <tr>
                        <td class="k">姓别:</td>      
                        <td>女</td>
                    </tr>
                    <tr>
                        <td class="k">籍贯:</td>
                        <td>安徽省淮北市</td>
                    </tr>
                    <tr> 
                        <td class="k">学校:</td>
                        <td>淮北师范大学</td>
                    </tr>
                    <tr>
                        <td class="k">政治面貌:</td>             
                        <td>共青团员</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    <script>
        // api  application interface 应用程序接口
        // 封装复杂,接口简单
        // $(element).is(":visible")  判断元素显示
        $("#grxx").click(function(){
            console.log($("#kuang").is(":visible"))
            if($("#kuang").is(":visible")){
                $("#kuang").hide(1000)               
            }else{
                $("#kuang").show(1000)              
            }
        })   
    </script>
</body>
</html>